<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no" />
    <title></title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../css/common.css"/>
    <style>
    .list{
    	background-color: #FFFFFF;
    }
    .list .item{
    	border-bottom: 1px solid #ebebeb;
    	padding: 0.7em 0.7em 0.8em 0.6em;
    }
    .itemActive{
    	background-color: #efefef;
    }
    .list .item .content{
    	color: #4c4c4c;
    	font-size: 1.1em; line-height: 1.6; margin-bottom: 0.1em;
    	word-break: break-all; word-wrap:break-word;	/* 自动换行 */
    }
	.content img{
	    width: 100%; margin-bottom: 0.5em;
	}
    .list .item .info{
    	font-size: 0.8em;
    	padding-top: 0.4em;
    }
    .list .item .info span{
    	color: #9a9a9a;
    	margin-right: 1em;
    }
    </style>
</head>
<body>
    <div id="wrap">
		<div class="list" id="list">
		</div>
    </div>
	<input id="now_comment_reply" type="hidden" value="">
	
<script type="text/javascript" src="../script/zepto.min.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/config.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript" src="../script/doT.min.js"></script> 
<script>
var fid,tid,title;
$api.setStorage('comment_list_page', 1);
$api.setStorage('comment_total_pages', 0);

apiready = function () {
	var pageParam = api.pageParam;
	fid = pageParam.fid;
	tid = pageParam.tid;
	title = pageParam.title;
	
	getList(1, 'first');	// 首次加载
	
	// 下拉刷新
	/*
	api.setRefreshHeaderInfo({
	    visible: true,
	    loadingImg: 'widget://image/pulltorefresh_arrow.png',
	    bgColor: '#ccc',
	    textColor: '#fff',
	    textDown: '下拉刷新...',
	    textUp: '松开刷新...',
	    showTime: true
	}, function(ret, err){
		$api.setStorage('comment_list_page', 1);
	    //从服务器加载数据，完成后调用api.refreshHeaderLoadDone()方法恢复组件到默认状态
	    getList(1, 'refresh');
	});*/
	
	// 页面滑动到底部加载更多
	api.addEventListener({
		name:'scrolltobottom'
	},function(ret,err){
		var page = $api.getStorage('comment_list_page');
		if(page > 1){
			getList(page, 'more');
		}
	    
	});
}

function getList(page, type){
	page = parseInt(page);
	var comment_total_pages = parseInt($api.getStorage('comment_total_pages'))
	if(type != 'refresh' && page == 1 && comment_total_pages == 1){
		return false;
	}
	if(type == 'more' && comment_total_pages < page){
		return false;
	}


	if(type != 'refresh'){
		api.showProgress({
		    style: 'default',
		    animationType: 'fade',
		    modal: false
		});
	}
	
	api.ajax({
		url: OpenAPI.read + tid +'&page=' + page,
	    method: 'get',
	    timeout: 30,
	    dataType: 'text',
	    charset: 'gbk',
	    returnAll:true,
	    
	},function(ret,err){
		api.hideProgress();
		
		if(type == 'refresh'){
			api.refreshHeaderLoadDone();
		}
		
		var html = ret.body;
		if (parseInt(ret.statusCode) == 200) {
			if(page == 1){	// 第一页获取总页数
				var  mPage=html.match(/&page=(\d+)" style="font-weight:bold">＞<\/a><\/div><\/td><td align="right">/);
				if(null != mPage){
					$api.setStorage('comment_total_pages', mPage[1]);
				}
			}
			
			html = htmlcompress(html);	// 压缩html
			
        	// 提取所以帖子的相关信息
			var listhtml = '';
			html.replace(/<a name=(.*?)<\/a><\/span>		<\/div><\/th>	<\/tr><\/table>/g, function(a,b) {
			
			    var  mPid = b.match(/^(.+)><\/a><div/);
				if(null != typeof mPid){
					var pid = mPid[1];	// pid
					if(pid != 'tpc'){	// 跳过1楼
						var mAuthor = b.match(/<b>(.+)<\/b>/);
						var author = mAuthor[1];	// 作者
					
						var mPubdate = b.match(/Posted: (.+) \|/);
						var pubdate = mPubdate[1];	// 回帖时间
						
						var mFloor = b.match(/回覆 (\d+)樓/);
						var floor = mFloor[1];	// 回帖内容
						
						var mContent = b.match(/<div class="tpc_content" >(.+)<\/div>		<\/th>	<\/tr>/);
						var content = mContent[1];	// 回帖内容
						
						content = content.replace(/<a[^>]*>/g, '');	// 去掉 <a> 标签
						content = content.replace(/<\/a>/g, '');
						
						content = content.replace(/(disabled|onclick)=/g, 'delete=');	//  disabled|onclick 替换换成 delete
						content = content.replace(/input type='image'/g, 'img');	// input 替换成 img
						
						// 处理表情
						//content = content.replace(/\.gif" alt="/g, ".png\" width=\"22px\" height=\"22px\" alt=\"");
						var reply_author = escape(author);
						listhtml += '<div class="item"  tapmode="itemActive" onclick="comment_reply(\'' +reply_author+ '\', '+pid+', '+floor+')">'+
									'<div class="content">' +content+ '</div>'+
									'<div class="info">'+
									'<span class="floor">第 ' +floor+ ' 樓</span><span class="author">' +author+ '</span><span class="time">' +pubdate+ '</span>'+
									'</div>'+
									'</div>';

					}
				}

			});
			
			if(page==1){
				$api.html($api.byId('list'), listhtml);
			}else if(page>1){
				$api.append($api.byId('list'), listhtml);
			}
			
			if(type == 'refresh'){
				$api.setStorage('comment_list_page', 1);
			}else{
				$api.setStorage('comment_list_page', parseInt(page)+1);
			}
			
			 api.parseTapmode();
			
		}else{
			showErrMgs(err.code, err.msg);
		}

	    
	});
	
	

}

function refreshComment(){
	getList(1, 'refresh');
}

function comment_reply(reply_author, pid, floor){
	var now_comment_reply = $('#now_comment_reply').val();
	if(now_comment_reply != pid){
		$('#now_comment_reply').val(pid);
		api.execScript({
		    name: 'win_comment',
		    script: 'writeComment("'+reply_author+'", '+pid+', '+floor+')',
		});
	}else{	// 取消回复某人
		$('#now_comment_reply').val('');
		api.execScript({
		    name: 'win_comment',
		    script: 'writeComment()',
		});
	}
}
</script>
</body>
</html>